<template>
  <div class="box__">
    <div class="box_live">
      <div class="img_box">
        <img
          v-if="data?.process == 'PASS'"
          src="../../../assets/images/live/img3.png"
          alt=""
        />
        <img
          v-else-if="data?.process == 'TOBEAUDITED'"
          src="../../../assets/images/live/img1.png"
          alt=""
        />
        <img
          v-else-if="data?.process == 'REFUSE'"
          src="../../../assets/images/live/img2.png"
          alt=""
        />
      </div>
      <div class="apply">
        <!-- 没有直播申请信息 -->
        <div @click="addFn" v-if="!data">直播申请</div>
        <!-- 待审核 -->
        <div v-else-if="data?.process == 'TOBEAUDITED'" @click="emitFn">
          查看直播申请信息
        </div>
        <!-- 审核拒绝：REFUSE -->
        <div v-else-if="data?.process == 'REFUSE'" @click="emitFn">
          修改直播信息
        </div>
        <!-- 审核通过：PASS -->
        <div v-else-if="data?.process == 'PASS'" @click="startLive">
          开启直播视频
        </div>
      </div>
      <div class="tips cp" v-if="data?.process == 'REFUSE'">
        直播资质审核不通过，不通过理由：{{ data.refuseReason }}
      </div>
      <div class="tips cp" v-else-if="data?.process == 'TOBEAUDITED'">
        直播资质审核中，请耐心等待...
      </div>
      <div class="tips cp" @click="emitFn" v-else-if="data?.process == 'PASS'">
        修改直播信息
      </div>
      <div class="tips cp" v-if="!data">专家在平台直播必须先通过直播申请</div>
    </div>
  </div>
</template>

<script>
import { liveStatus, openLive } from "@/request/api";
export default {
  data() {
    return {
      data: null,
    };
  },
  created() {
    this.getLiveStatus();
  },
  methods: {
    //开始直播
    startLive() {
      openLive({
        openLive: "OPEN",
      }).then((res) => {
        console.log(res,'点击分尸按钮');
      });
    },
    //获取当前状态
    getLiveStatus() {
      liveStatus().then((res) => {
        if (res.code == 200) {
          this.data = res.result;
        } else {
          this.$message.error("获取直播状态失败！");
        }
      });
    },
    //新增
    addFn() {
      this.$router.push("/live/add");
    },
    //编辑 查看
    emitFn() {
      let data = JSON.stringify(this.data);
      if (this.data.process == "PASS") {
        this.$confirm(
          "修改直播信息需要管理员审核，审核通过后才能重新直播，是否确认修改?",
          "提示",
          {
            confirmButtonText: "前往修改",
            cancelButtonText: "取消",
            type: "warning",
          }
        )
          .then(() => {
            this.$router.push(`/live/emit/${data}`);
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消修改",
            });
          });
      } else {
        this.$router.push(`/live/emit/${data}`);
      }
    },
  },
};
</script>

<style lang="less" scoped>
.tips {
  font-size: 0.875rem;
  font-family: Source Han Sans SC;
  font-weight: 400;
  margin-top: 1rem;
  color: #929292;
  text-align: center;
}
.box__ {
  width: 100%;
  min-height: calc(100vh - 17.5rem);
  box-sizing: border-box;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
}
.worp {
  width: 100%;
  height: 100%;
}
.box_live {
  position: relative;
  padding: 6.25rem;
}
.img_box {
  display: flex;
  justify-content: center;
  img {
    width: 13rem;
    height: 13rem;
  }
}
.apply {
  div {
    background-color: var(--themeCOlor);
    color: #ffffff;
    display: inline-block !important;
    padding: 0.5625rem 1.4375rem;
    border-radius: 0.25rem;
    cursor: pointer;
  }

  display: flex;
  justify-content: center;
}
</style>